/**
 * Created by 小敏哥 on 2017/9/7.
 */
import React, {Component} from 'react';
import ItemList from '../../common/itemList';
import style from './index.scss';

class CarDetail extends Component {
    constructor(props) {
        super(props);
    }

    getDayText(){
        if(this.props.days){
            if(this.props.status==4||this.props.status==5){
                return `${parseInt(this.props.days/365)}年${this.props.days%365}天`;
            }
            else{
                return `${this.props.days}天`;
            }
        }
        else{
            return '';
        }
    }

    getDayTextClass(){
        return this.props.status==0||this.props.status==1?"":style.colorfulDay;
    }

    render() {
        return <div className={style.container}>
            <ItemList borderPaddingLeft="15px" borderPaddingRight="15px">
                <div className={style.detailItem + ' ' + style.flexItem}>
                    <div className={style.circle}></div>
                    <div>车辆注册日期</div>
                    <div>{this.props.registerDate}</div>
                </div>
                <div className={style.detailItem + ' ' + style.flexItem}>
                    <div className={style.circle}></div>
                    <div>检验有效期至</div>
                    <div>{this.props.expiryDate}</div>
                </div>
                <div className={style.detailItem}>
                    <div className={style.flexItem}>
                        <div className={style.circle}></div>
                        <div>{this.props.daysText}</div>
                        <div className={this.getDayTextClass()}>{this.getDayText()}</div>
                    </div>
                    <div className={style.errorTips}>
                        <span>不正确？</span>
                        <button onClick={()=>{this.props.reCalculate()}}>重新计算</button>
                    </div>
                </div>
            </ItemList>
        </div>
    }
}

export default CarDetail;